<%@ page language="java" pageEncoding="UTF-8"%>
<div ng-controller="UserBarShowController">
	<div class="panel panel-default">
		<div class="panel-heading">
			信息条
			<span class="pull-right">
				<button type="button" class="btn btn-default btn-sm" ng-click="create()"><i class="glyphicon glyphicon-plus-sign"></i> 添加</button>
			</span>
		</div>
		<div class="panel-body">
			<div class="panel-group">
		        <div class="panel panel-default" ng-repeat="bar in bars.root">
		            <div class="panel-heading">
		                <h4 class="panel-title">
		                    <span message="'ID:{{bar.id}}'" tooltip>{{bar.text}}</span>
		                    <span class="pull-right">
		                    	<button class="btn btn-success btn-xs" ng-click="edit(bar)"><i class="glyphicon glyphicon-edit"></i> 编辑</button>
								<button class="btn btn-danger btn-xs" ng-click="remove(bar)"><i class="glyphicon glyphicon-remove"></i> 删除</button>
								<span class="badge">{{bar.children.length}}</span>
		                    </span>
		                </h4>
		            </div>
		            <div class="panel-collapse collapse" ng-class="{'in':bar.children.length!=0}">
		                <div class="panel-body">
		                    <table class="table">
		                        <thead>
		                       		<tr>
										<th>
											ID
										</th>
										<th>
											名称
										</th>
										<th>
											索引
										</th>
										<th>
											操作
										</th>
									</tr>
								</thead>
								<tbody>
		                        	<tr ng-repeat="children in bar.children">
		                        		<td>
							     			{{children.id}}
							     		</td>
							     		<td>
							     			{{children.text}}
							     		</td>
							     		<td>
							     			{{children.index}}
							     		</td>
							        	<td>
							        		<button class="btn btn-success btn-xs" ng-click="edit(children)"><i class="glyphicon glyphicon-edit"></i> 编辑</button>
											<button class="btn btn-danger btn-xs" ng-click="remove(children)"><i class="glyphicon glyphicon-remove"></i> 删除</button>
							        	</td>
		                        	</tr>
		                    	</tbody>
		                    </table>
		                </div>
		            </div>
		        </div>
		    </div>
		</div>
	</div>
	
	<div class="panel panel-default">
		<div class="panel-heading">
			错误的节点 [没有根节点]
		</div>
		<div class="panel-body">
			<table class="table table-hover">
				<thead>
					<tr>
						<th>
							ID
						</th>
						<th>
							名称
						</th>
						<th>
							父节点
						</th>
						<th>
							索引
						</th>
						<th>
							操作
						</th>
					</tr>
				</thead>
				<tbody>
					<tr ng-repeat="bar in bars.error">
						<td>
							{{bar.id}}
						</td>
						<td>
							{{bar.text}}
						</td>
						<td>
							{{bar.parent}}
						</td>
						<td>
							{{bar.index}}
						</td>
						<td>
							<button class="btn btn-success btn-xs" ng-click="edit(bar)"><i class="glyphicon glyphicon-edit"></i> 编辑</button>
							<button class="btn btn-danger btn-xs" ng-click="remove(bar)"><i class="glyphicon glyphicon-remove"></i> 删除</button>
						</td>
					</tr>
				</tbody>
			</table>
		</div>
	</div>
    
	<div class="panel panel-default">
		<div class="panel-heading">
			角色配置
		</div>
		<div class="panel-body">
			<div class="form-group">
				<label>
					角色
				</label>
				<div>
					<select class="form-control" style="width: 150px;" ng-model="roleType" ng-change="updateView()">
						<option ng-repeat="roleType in roleTypes" value="{{roleType.id}}"> {{roleType.name}}
						</option>
					</select>
				</div>
			</div>
			<div class="form-group">
				<label>
					项
				</label>
				<div>
					<span  ng-repeat="bar in bars.all" style="padding: 10px 10px 10px 10px;float: left;">
						<label class="checkbox">
							<input type="checkbox" value="{{bar.id}}" ng-model="bar.select" ng-checked="bar.select" />{{bar.text}}
						</label>
					</span>
				</div>
			</div>
		</div>
	</div>
	<div>
		<button type="button" class="btn btn-success btn-sm" ng-click="updateBarRole()"><i class="glyphicon glyphicon-upload"></i> 更新</button>
	</div>
</div>